<template>
  <div class="app-container">
    <div class="ces-main">


      <el-form ref="form" :model="FormData" :inline="true" :rules="rules" label-position="right" label-width="120px">
        <el-form-item style="height:30px">

          <el-button type="primary" icon="el-icon-search" size="small" @click="getDataList">查询</el-button>
          <el-button type="primary" icon="el-icon-search" size="small" @click="FunRowAdd">添加</el-button>
        </el-form-item>
        <Search-Form ref="form" size='mini' labelWidth='50px' :searchData='Search' :inline="true" :tableCols='tableCols'
          @handDataList="getDataList" :searchHandle="searchHandle"></Search-Form>
      </el-form>
      <ces-table size='mini' ref="reftableData" :isSelection='true' :isIndex='true' :isSearch='true' :isHandle='false'
        :handleEditWin='true' :Isfunfail='Isfunfail' :tableData='tableData' :tableCols='tableCols' :Search='Search'
        :tableHeight='500' @refresh="refresh" @handleEdit='handleEdit' @handleEditWin="handleEditWin" @SelectionChange='handleSelectionChange'
        @handleDelete="delData" @select="handselect">
      </ces-table>
    </div>
  </div>
</template>

<script>


//引入组件

import cesTable from "../Common//table.vue";
import SearchForm from "../Common//Search.vue";
import MianForm from "../Common//form.vue";

import { funDownload, GetTableColsData, getFormDataList } from "@/api/Common";
import vGetToolBar from "../Common/GetToolBar";

export default {
  data() {
    //表单查询一般分为input，下拉框，和日期，下面是下拉框时的设置下拉信息的情况，我的项目没有用到，但是留着方便看

    return {
      tableData: [],//表格数据
      tableCols: [],//表格列数据
      multipleTable: [],
      ParmType: "",
      index: 0,
      Indexs: '',
      searchHandle: [],
      Isjudge: false,
      IsfunEdit: false,
      Isfunfail: false,
      Search: this.SearchData,
      Keys: '',
      cities: [
        {
          value: "0",
          label: "草稿",
        },
        {
          value: "1",
          label: "审核中",
        },
        {
          value: "2",
          label: "结案",
        },
        {
          value: "3",
          label: "作废",
        },
      ],
      SearchDialog: false,
      DialogBtnMargin: 0,
      dialogVisible: false,

    }
  },
  // props: {
  //   // 表格型号：mini,medium,mini
  //   Isfunfail: { type: Boolean, default: 'false' },
  // },
  components: { //引入组件后注册组件
    cesTable,
    vGetToolBar,
    SearchForm,
    MianForm
  },
  mounted() {
    this.getTableCols()
    this.getDataList()
  }, props: {
    ParmType: String,
    index: Int16Array,
    required: true,
    FormDataInterID: String,
    Where: String,
    SearchData: { type: Object },
    KeyName: String,
  },
  methods: {
    //搜索重置
    refresh() {
      this.getDataList();
    },
    reform() {
      this.Search = this.SearchData;
      this.getDataList();
    },
    //读取列配置
    async getTableCols() {
      this.tableCols = []
      const res = await GetTableColsData({ InterID: this.FormDataInterID });
      this.tableCols = res.data;

    },
    async getDataList() {

      const res = await getFormDataList({ data: JSON.stringify(this.Search), InterID: this.FormDataInterID });
      this.tableData = res.data.Table;

      //将data 中的数据放到DataList中
      this.Search.total = res.data.Table1[0].RecordCount;

      // this.tableData[0].forEach(row => {
      //     this.$refs['reftableData'].toggleRowSelection(row);
      //   });

    }, async handeAdd() {
      // 新建

      this.$emit('FunrRowsAdd', this.multipleTable, this.ParmType);

    }
    , handleSelectionChange(val, row) {


    }
    , handselect(rows, row) {

      let isActive = true;



      if (this.KeyName != null)//翻页记录添加行
      {

        //判断是否有删除
        if (rows.findIndex(item => item[this.KeyName] == row[this.KeyName]) == -1) {
          isActive = false
          this.Keys = row[this.KeyName];
        }


        rows.forEach(line => {

          if (this.multipleTable != null) {



            if (this.multipleTable.findIndex(item => item[this.KeyName] == line[this.KeyName]) == -1)//重复行不添加
            {

              this.multipleTable.push(line);
            }
          } else {

            this.multipleTable.push(line);
          }




        })

      } else {
        this.multipleTable = rows;
      }

      if (isActive == false) {

        this.$forceUpdate();
        //查找索引
        let Indexs = this.multipleTable.findIndex(item => item[this.KeyName] == this.Keys);
        //删除
        this.multipleTable.splice(Indexs, 1);
      }


      //删除行


    }

    , FunRowAdd() {



      //this.$refs['reftableData'].toggleSelection(this.tableData);
      this.$emit('FunRowAdd', this.multipleTable, this.ParmType, this.index);



    },
    FunRowAddOne() {



      //this.$refs['reftableData'].toggleSelection(this.tableData);
      this.$emit('FunRowAddOne', this.multipleTable, this.ParmType, this.index);



    }


  }
}
</script>

<style lang="scss" scoped>
.app-container {
  .EditObjs-table {
    margin-top: 30px;
  }

  .permission-tree {
    margin-bottom: 5px;
  }
}

.searchDialog ::v-deep .el-dialog__header {
  background: #409eff;
}

.searchDialog ::v-deep .el-dialog__title {
  color: #fff;
}

.searchDialog ::v-deep .el-dialog__headerbtn .el-dialog__close {
  color: #fff;
}
</style>